<template>
  <div class="histroy">

    <section class="address-search py-20 flex-space-between">
      <div @click="back"> < </div>
      <div>浏览足迹</div>
      <div @click="all">全选</div>
    </section>




    <!--    list-->
    <section>
      <div v-for="item in 10" class="border-bottom van-card my-card">
        <van-card
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
        <div class="ml-40">地址：xxxxxxxxxxxxxxxxx</div>
        <div class="status">营业中</div>
        <div class="checked"><van-checkbox v-model="checked"></van-checkbox></div>
      </div>

    </section>

    <section class="delete" v-if="checked">
      <van-button type="danger" class="w-full">删除</van-button>
    </section>
  </div>
</template>

<script>
import Swipe from '@/components/Swipe'

export default {
  name: 'Home',
  components: {
    Swipe
  },
  data() {
    return {
      value1: 0,
      value2: 'a',
      value: '',
      active: 0,
      checked: false,
      option1: [
        {text: '全部商品', value: 0},
        {text: '新款商品', value: 1},
        {text: '活动商品', value: 2},
      ],
    }
  },
  methods: {
    back() {
      history.go(-1)
    },
    all(){
      this.checked = !this.checked
    }
  },
}
</script>

<style lang="less" scoped>
.address-search {
  background-color: #39a9ed;
  display: flex;
  align-items: center;
  height: 50px;
  color: #fff;
  justify-content: space-around;
}
.my-card{
  position: relative;
}
.status{
  position: absolute;
  right: 20px;
  top: 30px;
  color: #39a9ed;
}
.checked{
  position: absolute;
  right: 40px;
  top: 80px;
}
.delete{
  width: 100%;
  position: fixed;
  bottom: 0;
}
</style>
